<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div class="box">
        <span v-if="score >= 90">优秀</span>
        <span v-else-if="score >= 80">良好</span>
        <span v-else-if="score >= 70">中等</span>
        <span v-else-if="score >= 60">及格</span>
        <span v-else>不及格</span>
        <span>{{res}}</span>
    </div>

</body>
<script src="https://cdn.bootcss.com/vue/2.6.11/vue.js"></script>
<script>
    const app = new Vue({
        el: '.box',
        data: {
            score: 80,

        },
        computed: {
            res: function() {
                let msg = '';
                if (this.score >= 90) {
                    msg = '优秀';
                } else if (this.score >= 80) {
                    msg = '良好';
                } else {
                    msg = '不及格';
                }
                return msg;
            }
        }
    })
</script>

</html>